<template>
	<view>
		<u-row customStyle="margin-bottom: 80px">
			<u-col span="12">
				<view>
					<u-navbar
					    title="项目经历"
						titleStyle="font-weight:bold"
					    :safeAreaInsetTop="true"
						:fixed='true'
						bgColor="#FFBE59"
						@leftClick="leftClick"
						@rightClick="delIntention"
					>
					    <view
					        class="u-nav-slot"
					        slot="left"
							
					    >
					        <u-icon
					            name="arrow-left"
					            size="20"
								color="black"
					        ></u-icon>
					    </view>
						<view
						    class="u-nav-slot"
						    slot="right"
						>
						    <u-icon
								v-if="this.proId!=''"
						        name="trash"
						        size="22"
								color="black"
						    ></u-icon>
						</view>
					</u-navbar>
				</view>
			</u-col>
		</u-row>
		<u-modal :show="showConfirm" @confirm="confirmFunction()" @cancel="cancelFunction()" width="250px" :content='contentConfirm' :showCancelButton='true'></u-modal>
		<u-row customStyle="margin-bottom: 10px">
			<u-col span="12" style="margin: 0 auto;">
				<view class="resume bg-purple-light">
					<u-col span="11" style="margin: 0 auto;">
						<view class="projectName bg-purple-light">
							<p>项目名称</p>
							 <u--input
							    placeholder="请输入项目名称"
							    border="bottom"
							    v-model="projectNameValue"
							  ></u--input>
						</view>
					</u-col>
					<u-col span="11" style="margin: 0 auto;">
						<view class="name-title bg-purple-light" @click="showProjectEntryTime=true">
							<span>项目开始时间</span>
							<u-icon class="name-title-icon" name="arrow-right" color="#ADADAD" size="16"></u-icon>
							<p><uni-dateformat :date="this.projectEntryTimeValue" format='yyyy/MM/dd'></uni-dateformat></p>
							<u-datetime-picker
								:show="showProjectEntryTime"
								v-model="projectEntryTimeValue"
								mode="date"
								:minDate="1980"
								@confirm="projectEntryTimeConfirm"
								@cancel="projectEntryTimeCancel"
							></u-datetime-picker>
						</view>
					</u-col>
					<u-col span="11" style="margin: 0 auto;">
						<view class="name-title bg-purple-light" @click="showProjectEndTime=true">
							<span>项目结束时间</span>
							<u-icon class="name-title-icon" name="arrow-right" color="#ADADAD" size="16"></u-icon>
							<p><uni-dateformat :date="this.projectEndTimeValue" format='yyyy/MM/dd'></uni-dateformat></p>
							<u-datetime-picker
								:show="showProjectEndTime"
								v-model="projectEndTimeValue"
								mode="date"
								:minDate="1980"
								@confirm="projectEndTimeConfirm"
								@cancel="projectEndTimeCancel"
							></u-datetime-picker>
						</view>
					</u-col>
					<u-col span="11" style="margin: 0 auto;">
						<view class="projectDescription bg-purple-light">
							<p>项目描述</p>
							<u--textarea v-model="projectDescriptionValue" placeholder="请输入项目描述" style="margin-top: 10px;"></u--textarea>
						</view>
					</u-col>
					<u-col span="11" style="margin: 0 auto;">
						<view class="keep-button bg-purple-light">
							<u-button type="primary" @click="subPro()" text="保存"></u-button>
						</view>
					</u-col>
				</view>
			</u-col>
		</u-row>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				projectNameValue:'',
				showProjectEntryTime: false,
				projectEntryTimeValue: "",
				showProjectEndTime: false,
				projectEndTimeValue: "",
				projectDescriptionValue:'',
				proId:'',
				resumeId:'',
				proUrl:'',
				pro:{},
				showConfirm:false,
				contentConfirm:'',
			}
		},
		created() {
			if(this.proId!=""){
				this.$axios.get('/resume/employmentResume/queryProjectExperienceById?id='+this.proId).then((res)=>{
					if(res.data.result){
						this.pro = res.data.result;
						this.resumeId = this.pro.resumeId;
						this.projectNameValue = this.pro.projectName;
						this.projectDescriptionValue = this.pro.projectAbout;
						this.projectEntryTimeValue = this.pro.projectStart;
						this.projectEndTimeValue = this.pro.projectEnd;
					}
				});
			}
		},
		methods: {
			//左侧点击返回上一页面
			leftClick(){
				uni.reLaunch({
					url: '/pages/service/practicaltrainingservice/resume/resume',
				});
			},
			//删除的对话窗
			delIntention(){
				this.showConfirm = true;
				this.contentConfirm = "确认要删除吗？";
			},
			confirmFunction(){//确认按钮
				this.$axios.get('/resume/employmentResume/delProjectExperienceById?id='+this.pro.id).then((res)=>{
					if(res.data.success){//true
						uni.redirectTo({
							url: '/pages/service/practicaltrainingservice/resume/resume',
						});
					}else{
						this.$refs.uNotify.show({
							top: 45,
							type: 'error',
							color: 'white',
							bgColor: 'Rubber Ducky Yellow',
							message: '删除失败！',
							duration: 1000 * 3,
							fontSize: 14,
							safeAreaInsetTop:true
						})
					}
				});
			},
			cancelFunction(){//确认按钮
				this.showConfirm = false;
			},
			//保存
			subPro(){
				var flag = true;
				//判断表单value是否为空
				if(this.projectNameValue==""||this.projectNameValue==undefined){
					flag = false;
				}
				if(this.projectEntryTimeValue==""||this.projectEntryTimeValue==undefined){
					flag = false;
				}
				if(this.projectEndTimeValue==""||this.projectEndTimeValue==undefined){
					flag = false;
				}
				if(this.projectDescriptionValue==""||this.projectDescriptionValue==undefined){
					flag = false;
				}
				if(flag==true){
					//判断入学日期和毕业日期是否正确
					if(this.projectEntryTimeValue>this.projectEndTimeValue||this.projectEndTimeValue==this.projectEntryTimeValue){
						uni.showToast({
							icon: 'error',
							position: 'bottom',
							title: '日期选择有误'
						});
						window.eval(flag);//指定执行指定代码	（var flag=true）
						return ;
					}
					this.pro.resumeId = this.resumeId;
					this.pro.projectName = this.projectNameValue;
					this.pro.projectAbout = this.projectDescriptionValue;
					this.pro.projectStart = this.projectEntryTimeValue;
					this.pro.projectEnd = this.projectEndTimeValue;
					//通过项目经历编号是否为空判断是新增还是修改
					if(this.proId!=""){//修改
						this.proUrl = "/resume/employmentResume/upProjectExperience";
					}else{//新增
						this.proUrl = "/resume/employmentResume/addProjectExperience";
					}
					this.$axios.post(this.proUrl,this.pro).then((res)=>{
						if(res.data.success){//true
							uni.redirectTo({
								url: '/pages/service/practicaltrainingservice/resume/resume',
							});
						}else{
							uni.showToast({
								icon: 'error',
								position: 'bottom',
								title: '操作失败'
							});
						}
					});
				}else{
					uni.showToast({
						icon: 'error',
						position: 'bottom',
						title: '信息填写不完整'
					});
				}
			},
			projectEntryTimeConfirm(e) {
				this.projectEntryTimeValue = e.value[0];
				this.showProjectEntryTime = false;
			},
			projectEntryTimeCancel(){
				this.showProjectEntryTime = false;
			},
			projectEndTimeConfirm(e) {
				this.projectEndTimeValue = e.value[0];
				this.showProjectEndTime = false;
			},
			projectEndTimeCancel(){
				this.showProjectEndTime = false;
			},
		},
		//接收路径参数
		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
			this.proId = option.proId;
			this.resumeId = option.resumeId;
		}
	}
</script>

<style lang="less">
	.projectName p,.projectDescription p{font-size: 14px;color: #3C3C3C;}
	.name-title p{font-size: 14px;color: #3C3C3C;margin-top: 12px;margin-left:2px;font-size: 14px;font-weight: bold;}
	.name-title,.projectName{height: 56px;margin-top: 20px;}
	.name-title{border-bottom: 0.1px solid #E5E4E2;}
	span{font-size: 14px;color: #3C3C3C;}
	.name-title-icon{float: right;margin-top: 10px;}
	.keep-button{margin-top: 20px;}
	.projectDescription{margin-top: 20px;}
</style>